<template>
	<div class="hello">
		关于插件详情还是查官方文档好，我这边只是小用一下<br />
		<img v-lazy="'/src/assets/'+logo+'.png'"  preview preview-text="描述" />
		<button @click="getdata()">vue-axios</button>
	</div>
</template>

<script>
export default {
	name: 'HelloWorld',
	data() {
		return {
			msg: 'Welcome to Your Vue.js App',
			age: '12',
			logo:'logo'
		};
	},
	mounted() {
		console.log(this.$store.state);
		this.$store.commit('showMe', this.msg);
		this.$store.commit('showAge', this.age);
		console.log(this.$store.state);
	},
	methods: {
		//Axios使用 使用箭头函数，不然this指针会变化
		getdata: function() {
			var api = 'http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1';
			this.axios
				.get(api)
				.then(res => {
					console.log(res);
					this.list = res.data.result;
					console.log(this.list);
				})
				.catch(err => {
					console.log(err);
				});
		}
	}
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped></style>
